<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:body>
	<ui:composition template="/template/common/commonLayout.xhtml">

		<ui:define name="content">


			<h:panelGrid>
				<p:dataTable id="users" var="user"
					value="#{userTableBean.userTableDataModel}" scrollable="true"
					 style="width: 100%" editable="true" scrollHeight="300">

					<p:ajax event="rowEdit" listener="#{userTableBean.onEdit}"
						update="users :mainForm:growl" />
					<p:ajax event="rowEditCancel" listener="#{userTableBean.onCancel}" />

					<p:column style="width:18%" headerText="Login">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{user.login}" />
							</f:facet>
							<f:facet name="input">
								<p:inputText value="#{user.login}" />
							</f:facet>
						</p:cellEditor>
					</p:column>


					<p:column style="width:18%" headerText="Name">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{user.name}" />
							</f:facet>
							<f:facet name="input">
								<p:inputText value="#{user.name}" />
							</f:facet>
						</p:cellEditor>
					</p:column>

					<p:column style="width:18%" headerText="Surname">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{user.surname}" />
							</f:facet>
							<f:facet name="input">
								<p:inputText value="#{user.surname}" />
							</f:facet>
						</p:cellEditor>
					</p:column>

					<p:column style="width:18%" headerText="Birthday">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{user.birthday}">
									<f:convertDateTime pattern="dd.MM.yyyy" />
								</h:outputText>
							</f:facet>
							<f:facet name="input">
								<p:calendar value="#{user.birthday}" />
							</f:facet>
						</p:cellEditor>
					</p:column>


					<p:column style="width:18%" headerText="Role">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{user.role}" />
							</f:facet>
							<f:facet name="input">
								<p:selectOneMenu value="#{user.role}">
									<f:selectItems value="#{userTableBean.roles}" />
								</p:selectOneMenu>
							</f:facet>
						</p:cellEditor>
					</p:column>

					<p:column style="width:10%">

						<p:rowEditor />
						<p:commandButton update="users :mainForm:growl"
							oncomplete="#{userTableBean.deleteUser()}" style="wight: 10px"
							icon="ui-icon-close" title="Delete">
							<f:setPropertyActionListener value="#{user}"
								target="#{userTableBean.selectedUser}" />
						</p:commandButton>
						


					</p:column>

					<f:facet name="footer">
						<h:panelGrid columns="2">
							<p:commandButton id="addButton" value="Add"
								icon="ui-icon-circle-plus" oncomplete="addUserDialog.show()" />
							<h:panelGrid columns="2">
							    Select train:
								<p:selectOneMenu style="width: 100%" value="#{userTableBean.tteSelected}"
									converter="timeTableConverter" effect="fade" var="t"
									filter="true" filterMatchMode="contains">
									<p:ajax update="users"
										listener="#{userTableBean.filterPassengers()}" />
									<f:selectItem itemLabel="All" itemValue="" />
									<f:selectItems value="#{userTableBean.ttes}" var="tte"
										itemValue="#{tte}" itemLabel="#{tte.train.number}" />


									<p:column>
                                       #{t.train.number}-(#{t.departureStation.name}-#{t.arrivalStation.name})
						                 </p:column>
								</p:selectOneMenu>
							</h:panelGrid>

						</h:panelGrid>
					</f:facet>
				</p:dataTable>

			</h:panelGrid>
			



			<p:dialog header="Add user" widgetVar="addUserDialog"
				resizable="false" showEffect="clip" hideEffect="fold">
				<h:panelGrid cellspacing="8">
					<h:panelGrid columns="2">
						<p:outputLabel for="login" value="Login" />
						<p:inputText id="login" value="#{userTableBean.login}" />

						<p:outputLabel for="pwd" value="Password" />
						<p:password id="pwd" value="#{userTableBean.password}" />

						<p:outputLabel for="congirm" value="Confirm" />
						<p:password id="congirm" value="#{userTableBean.confirm}" />

						<p:outputLabel for="name" value="Name" />
						<p:inputText id="name" value="#{userTableBean.name}" />

						<p:outputLabel for="surname" value="Surname" />
						<p:inputText id="surname" value="#{userTableBean.surname}" />


						<p:outputLabel for="birthday" value="Birthday" />
						<p:calendar id="birthday" navigator="true" value="#{userTableBean.birthday}" />


						<p:outputLabel for="role" value="Role" />
						<p:selectOneMenu id="role" value="#{userTableBean.role}">
							<f:selectItem itemLabel="Select One" itemValue="" />
							<f:selectItems value="#{userTableBean.roles}" />
						</p:selectOneMenu>
					</h:panelGrid>

					<h:panelGrid columns="2" cellspacing="8">
						<p:commandButton value="Add" action="#{userTableBean.addUser()}"
							onclick="addUserDialog.hide()"
							update="users growl" />
						<p:commandButton value="Cancel" onclick="addUserDialog.hide()" />
					</h:panelGrid>
				</h:panelGrid>
			</p:dialog>

		
		</ui:define>




	</ui:composition>

</h:body>
</html>